{extend name="property/public/insidePageBase" /}
{block name="title"}充电桩订单详情{/block}
{block name="css"}
{__block__}
<style>
    body{
        margin:0;
    }
    body{
        background-color: #ffffff;
    }
    .inputtle {
        width: 100px;
        padding: 0px 15px 0px 25px;
        text-align: right;
    }
    .ninputtBox {
        margin-bottom: 15px;
    }
    .df {
        display: flex;
    }
    .fx1 {
        flex: 1;
    }
    .jz {
        display: flex;
        align-property:center;
        justify-content: center;
    }
    .textove {
        display: -webkit-box !important;
        /*display:-moz-box !important;*/
        overflow: hidden;
        text-overflow: ellipsis;
        word-break: break-all;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 1;
    }

</style>
{/block}
{block name="body"}
<div class="layuimini-container">
    <div class="layuimini-main">
        <div class="layui-form">
            <div>
                <div class="df jz ninputtBox">
                    <div class="fx1">
                        <div class="df jz">
                            <div class="textove">用户：</div>
                            <div class="fx1">{$info['nickname']}</div>
                        </div>
                    </div>
                </div>
                <div class="df jz ninputtBox">
                    <div class="fx1">
                        <div class="df jz">
                            <div class="textove">订单号：</div>
                            <div class="fx1">{$info['order_no']}</div>
                        </div>
                    </div>
                    <div class="fx1">
                        <div class="df jz">
                            <div class="textove">订单状态：</div>
                            {if $info['status'] == 0}
                                <div class="fx1">未付款</div>
                            {elseif $info['status'] == 1 /}
                                <div class="fx1">付款未充电</div>
                            {elseif $info['status'] == 2 /}
                                <div class="fx1">充电中</div>
                            {elseif $info['status'] == 3 /}
                                <div class="fx1">正常充电结束</div>
                            {elseif $info['status'] == 4 /}
                                <div class="fx1">异常结束</div>
                            {elseif $info['status'] == 5 /}
                                <div class="fx1">叠加结束</div>
                            {elseif $info['status'] == -1 /}
                                <div class="fx1">已取消</div>
                            {/if}
                        </div>
                    </div>
                </div>
                <div class="df jz ninputtBox">
                    <div class="fx1">
                        <div class="df jz">
                            <div class="textove">购买充电量（kwh 度）：</div>
                            <div class="fx1">{$info['work_kwh']} kwh</div>
                        </div>
                    </div>
                    <div class="fx1">
                        <div class="df jz">
                            <div class="textove">实际耗电：</div>
                            <div class="fx1">{$info['actual_power']}</div>
                        </div>
                    </div>
                </div>
                <div class="df jz ninputtBox">
                    <div class="fx1">
                        <div class="df jz">
                            <div class="textove">订单生成时间：</div>
                                <div class="fx1">{$info['add_time']}</div>
                            </script>
                        </div>
                    </div>
                    <div class="fx1">
                        <div class="df jz">
                            <div class="textove">交易状态：</div>
                            {if $info['pay_status'] == 0}
                                <div class="fx1">未支付</div>
                            {elseif $info['pay_status'] == 1 /}
                                <div class="fx1">己支付</div>
                            {elseif $info['pay_status'] == 2 /}
                                <div class="fx1">已退款</div>
                            {/if}
                        </div>
                    </div>
                </div>
                <div class="df jz ninputtBox">
                    <div class="fx1">
                        <div class="df jz">
                            <div class="textove">实际使用金额：</div>
                            <div class="fx1">{$info['actual_amount']}</div>
                        </div>
                    </div>
                    <div class="fx1">
                        <div class="df jz">
                            <div class="textove">支付方式：</div>
                            {if $info['pay_status'] > 0}
                            {if $info['pay_type'] == 'balance'}
                                <div class="fx1">余额支付</div>
                            {elseif $info['pay_type'] == 'wechat' /}
                                <div class="fx1">微信支付</div>
                            {elseif $info['pay_type'] == 'alipay' /}
                                <div class="fx1">支付宝支付</div>
                            {/if}
                            {else/}
                                <div class="fx1">未支付</div>
                            {/if}
                        </div>
                    </div>
                </div>
                <div class="df jz ninputtBox">
                    <div class="fx1">
                        <div class="df jz">
                            <div class="textove">开始充电时间至结束时间：</div>
                            <div class="fx1">{$info['start_time']??''} - {$info['end_time']??'--'}</div>
                        </script>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
{/block}